<template>
    
    <!-- 组件的模板 -->
    <div class="page user-center">
        <div class="weui-cells" v-if="isshow">
            <a v-if="back" class="weui-cell weui-cell_access" href="javascript:;" @click="gotoDistrictList(cid,cname)">
                <div class="weui-cell__bd">
                    <p>{{showname}}</p>
                </div>
                <div class="weui-cell__ft">已选地区</div>
            </a> 
            <a v-else class="weui-cell weui-cell_access" href="javascript:;" @click="getCurrAddress(did,dname)">
                <div class="weui-cell__bd">
                    <p>{{showname}}</p>
                </div>
                <div style="color: #bbb;font-size: 14px;line-height: 24px;">已选地区</div>
            </a>           
        </div> 
        <div class="weui-cells">
         <div v-if="cityArr && cityArr.length != 0">
             <a class="weui-cell weui-cell_access" href="javascript:;" v-for="item in cityArr" @click="gotoDistrictList(item.city_id,item.short_name)">
                <div class="weui-cell__hd"></div>
                <div class="weui-cell__bd">
                    <p>{{item.short_name}}</p>
                </div>
                <div class="weui-cell__ft"></div>
            </a>   
         </div>
         <div v-else>
            <a class="weui-cell weui-cell_access" href="javascript:;" @click="getCurrAddress(item.district_id,item.short_name)" v-for="item in districtArr" >
                <div class="weui-cell__hd"></div>
                <div class="weui-cell__bd">
                    <p>{{item.short_name}}</p>
                </div>
            </a>     
         </div>      
        </div>
    </div>  
</template>

<script> 
    /**
     *  引入工具类库 或 Native API
     *  example : import widget from 'gapi/widget'
     */
    import * as util from 'js/util.js'
    import widget from 'gapi/widget.js'
    import cache from 'gapi/cache.js'
    import commonPage from 'clientApi/commonPage.js'
    /**
     *  引入组件 以及 组件接口(Action)
     *  example : import Somecomponents from 'components/Somecomponents/Somecomponents'
     */

    /**
     *  组件实例对象
     */
    export default {
        components: {

        },
        data: function(){
            return{
                back:true,
                isshow:true,
                pid:'',
                pname:'',
                cid:'',
                cname:'',
                did:'',
                dname:'',
                showname:'',
                addressKey:{},
                addressVal:{},
                cityArr:[],
                districtArr: []
            }
        },
        vuex: {
            getters: {

            },
            actions: {

            }
        },
        methods: {
            /**
             * 初始化
             * @method init
             * @public
             * @return {Null} void
             */
            init (){
                
               this.pid = util.getUrddataString('province_id') 
               this.pname = util.getUrddataString('province_name') 
               // 获取缓存里的数据
                cache.getCache('addressArrData', (data) => {
                    // alert(JSON.stringify(data))
                    if(data&&data.value.province_name == this.pname){
                        this.isshow = true
                        if(this.pname == data.value.city_name){
                            this.showname = data.value.district_name 
                            this.did = data.key.district_id
                            this.dname = data.value.district_name
                            this.back = false
                        }else{
                           this.showname = data.value.city_name 
                           this.back =true
                        }
                        this.cid = data.key.city_id
                        this.cname = data.value.city_name
                    }else{
                        this.isshow = false
                    }
                })
            },
            // 前往区列表
            gotoDistrictList (city_id,city_name){
                let encodeStr = encodeURIComponent(`province_id=${this.pid}&province_name=${this.pname}&city_id=${city_id}&city_name=${city_name}`)
                location.href = `dmsaas://SelectDistrict?urdData=${encodeStr}`
            },
            //获取地址返回
            getCurrAddress (did,dname){
                this.addressKey = {
                    province_id:this.pid,
                    city_id:this.cid,
                    district_id:did
                } 
                this.addressVal = {
                    province_name:this.pname,
                    city_name:this.cname,
                    district_name:dname
                }
                cache.getMemoryCache('webViewID',(data)=>{
                    if(data){
                        commonPage.goBack(1,{'key':this.addressKey,'value': this.addressVal},data.webViewID)
                    }
                })
            }
        },
        created(){
            /*获取地区下拉选择列表，存放在缓存里*/ 
            let myData = JSON.parse(localStorage.getItem("localityData"))
            myData.forEach( (item) => {
                if(item.province_id == util.getUrddataString('province_id')){
                    let _cityArr = item.child
                    let p_name = item.short_name
                    item.child.forEach( (itemChild) => {
                        if(p_name == itemChild.short_name){
                            this.cid = itemChild.city_id
                            this.cname = itemChild.short_name
                            this.districtArr = itemChild.child
                        }else{
                            this.cityArr = _cityArr
                        }
                    })
                }
            })
            this.init();
            
        }
        
    }

    
</script>

<!-- CSS 样式 -->
<style src="../../node_modules/weui/dist/style/weui.css"></style>
<style src="../../static/css/common.css"></style>



